<template>
	<scroll-view scroll-y="true" >
		<view class="shoppingCartSearchList">
			<view class="shoppingCartItem" v-for="(item,index) in 10" :key="index">
				<view class="top">
					小王子的店铺
				</view>
				<view class="shoppingCartItem_1" v-for="(item,index) in 3" :key="index">
					<view class="right">
						<view class="left">
							<text>线上</text>
						</view>
						<view class="right">
							<text class="ellipsis_2">薰衣草味 4斤瓶装薰衣草味洗衣液（洗衣更护衣）干净 低泡易漂 4斤瓶装薰衣草洗衣液活动2</text>
							<text>颜色分类：黑色</text>
							<view class="">
								<view class="priceText">
									<text>25</text>
									<text>.00</text>
								</view>
								<text>商品</text>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		
	</scroll-view>
</template>

<script setup lang="ts">
</script>

<style lang="scss">
scroll-view{
	flex: 1;
	overflow: auto;
}
.shoppingCartSearchList{
	>view{
		margin-top: 0!important;
	}
}
.priceText{
	&:before{
		color: #262626!important;
	}
	text{
		color: #262626!important;
	}
}
.shoppingCartItem{
	border: 1rpx solid #E5E5E5;
	padding: 30rpx 24rpx;
	border-radius: 24rpx;
	background: #fff;
	margin: 24rpx 24rpx 0 24rpx;
	margin-bottom: 24rpx;
	>.top{
		display: flex;
		align-items: center;
		font-size: 32rpx;
		margin-bottom: 24rpx;
		image{
			width: 36rpx;
			margin-right: 24rpx;
		}
	}
	>view:nth-of-type(2){
		margin-top: 0!important;
	}
	.shoppingCartItem_1{
		display: flex;
		margin-top: 50rpx;
		align-items: center;
		>image{
			width: 36rpx;
			margin-right: 24rpx;
		}
		>.right{
			flex: 1;
			display: flex;
			align-items: center;
			>.left{
				width: 180rpx;
				margin-right: 24rpx;
				height: 180rpx;
				border-radius: 24rpx;
				background: #ccc;
				position: relative;
				text{
					display: inline-block;
					padding: 5rpx 16rpx;
					background: #CD9A67;
					color: #FFF5E2;
					font-size: 20rpx;
					border-radius: 24rpx 0 24rpx 0;
					position: absolute;
					left: 0;
					top: 0;
				}
			}
			>.right{
				flex: 1;
				width: 0;
				display: flex;
				flex-direction: column;
				>text:nth-of-type(1){
					line-height: 1.5;
				}
				>text:nth-of-type(2){
					font-size: 24rpx;
					color: #8C8C8C;
					margin: 8rpx 0;
				}
				>view{
					display: flex;
					align-items: center;
					justify-content: space-between;
					>text{
						width: 95rpx;
						line-height: 48rpx;
						text-align: center;
						font-size: 24rpx;
						color: #6B64D3;
						background: rgb(244,233,255);
					}
				}
			}
		}
	}
}
</style>